<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>DFM & Asociados</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">


<link href="../../css/estilo1.css" rel="stylesheet" type="text/css">
    
    <!--<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>-->
    <script type="text/javascript" src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
        
        
	<!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="../../css/bootstrap.min.css"/>

    <!-- Latest compiled and minified JavaScript -->
    <script src="../../js/bootstrap.min.js"></script>
    
    <style>
		.boxgridMenu {
			float: left;
			height: 40px;
			padding-top:5px;
			padding-bottom:7px;
			margin: 10px;
			overflow: hidden;
			position: relative;
			width: 170px;
			background-color:#CCC;
			/*para Firefox*/
			-moz-border-radius: 6px 6px 6px 6px;
			/*para Safari y Chrome*/
			-webkit-border-radius: 6px 6px 6px 6px;
			/* para Opera */
			border-radius: 6px;
			background-color: #C9EEFC;
			text-align:center;
			-webkit-box-shadow: 2px 2px 5px #999;
			box-shadow: 2px 2px 5px #999;
		    -moz-box-shadow: 2px 2px 5px #999;
		    filter: shadow(color=#999999, direction=135, strength=2);
		}
		
		.boxgridMenu > a {
			text-align:center;
			color:#FFF;
		}
		
		.boxgridMenu .menuItem3 {
			/*para Firefox*/
			-moz-border-radius: 5px 5px 5px 5px;
			/*para Safari y Chrome*/
			-webkit-border-radius: 5px 5px 5px 5px;
			/* para Opera */
			border-radius: 3px;
			width:100%;
		}
		
		.boxgridSubInfo {
			float: left;
			height: 360px;
			margin: 10px;
			margin-left:25px;
			overflow: hidden;
			position: relative;
			width: 270px;
			background:url(imagenes/subInfo.png) repeat;
			border:1px solid #E6E6E6;
			box-shadow: 1px 1px 4px rgba(0,0,0,0.6);
			text-align:left;
		}
		
		.boxgridSubInfo p {
			padding:10px;
			text-align:justify;
		}
		
		.boxgridSubInfo a {
			padding-left:10px;
		}
		
		.boxgridSubInfo h4 {
			padding-left:10px;
		}
		.active {
			color:#FFF;
			background-color:#900;
		}
		
	
	</style>
    
    <script type="text/javascript">
		$( document ).ready(function() {
			// Handler for .ready() called.
			$('#menuItem4').click('click', function(e) { 
			  // con esto, impedimos que se ejecute (más información)
			  e.preventDefault();
			  // leemos el atributo href de la etiqueta que es el ID a donde queremos ir
			  var adonde = $('#formContacto');
			  // guardamos su posición en la página (más información)
			  var posicion_donde = $(adonde).offset();
			  // y calculamos la distancia entre donde estamos y donde queremos ir
			  var distancia = posicion_donde.top;
			  // por último, nos movemoss usando una animación (más información)
			  $('body,html').animate({scrollTop: distancia}, 500);
			});
			
		});
	
	</script>
</head>

<body>
<div style=" background-color:#f5f4f5;">

<div style="text-align:center;margin:0 auto;width:100%;">

	<div style=" background: url(../../imagenes/herramientas.jpg) #f5f4f5 no-repeat; height:230px; background-position: right top;">
	
    	<div style="width: 45%; float: left;margin:0px 55px 0px 15px;text-align: right; z-index:4;">
    	<img src="../../imagenes/logo.png">
        
        </div>
        
        <div style="width: 45%; float: left;margin:20px 5px 0px 0px;text-align:justify;">
            <h3 style="margin-left:-55px; font-size:2.1em;"><strong>DM</strong> & Asociados</h3>
            <h4 style="margin-left:-55px; color: #333; font-family:Tahoma, Geneva, sans-serif; font-size:1.6em;">Consultora Integral</h4>
            <div style="margin-left:70%; margin-top:-60px;"><img src="../../imagenes/face.png"></div>
        	
            
            <!------------------nav ---------------->
            <div class="content" style="margin-left: -100%; margin-top:20px;">
            
            
            
            
            <div>
            
                <div class="boxgridMenu" style="margin-left:17%;">
            <!--    	<div style="width:100%; height:33%; border-bottom:1px solid #000; font-family:Verdana, Geneva, sans-serif; font-size:10px; font-weight:bold; text-align:left; color: #AAA; text-shadow:1px 1px 1px white;">1</div>-->
                    <div style=" font-family: Bebas; font-size:1.5em;" id="menuItem1" class="menuItem3"><a href="../../index.php" style="text-align:left;">Home</a></div>
                </div>
                <div class="boxgridMenu">
            <!--    	<div style="width:100%; height:33%; border-bottom:1px solid #000;font-family:Verdana, Geneva, sans-serif; font-size:10px; font-weight:bold;text-align:left; color:#AAA; text-shadow:1px 1px 1px white;">2</div>-->
                    <div style=" font-family: Bebas; font-size:1.5em;" id="menuItem2" class="menuItem3"><a href="../servicios/" style="text-align:left;">Servicios</a></div>
                </div>
                <div class="boxgridMenu active">
            <!--    	<div style="width:100%; height:33%; border-bottom:1px solid #000;font-family:Verdana, Geneva, sans-serif; font-size:10px; font-weight:bold;text-align:left; color:#AAA; text-shadow:1px 1px 1px white;">3</div>-->
                    <div style="font-family: Bebas; font-size:1.5em;" id="menuItem3" class="menuItem3"><a href="index.html" class="active">Herramientas</a></div>
                </div>
                <div class="boxgridMenu">
            <!--    	<div style="width:100%; height:33%; border-bottom:1px solid #000;font-family:Verdana, Geneva, sans-serif; font-size:10px; font-weight:bold;text-align:left; color:#AAA; text-shadow:1px 1px 1px white;">4</div>-->
                    <div style="font-family: Bebas; font-size:1.5em;" id="menuItem4" class="menuItem3"><a href="" style="text-align:left;">Contacto</a></div>
                </div>
            
            </div>
            
            
            <div style="height:40px;">
            
            </div>
            
            
            </div>
            
            
            
            <!----  fin del nav ---------------------->

        </div>
    	
        
        
        	<div class="big-slider-mask">
                <div class="side left">
                    <div class="rectangle"></div>
                    <div class="triangle"></div>
                </div>
                <div class="side right">
                    <div class="rectangle"></div>
                    <div class="triangle"></div>
                </div>
  			</div>
        	
            
    </div>
	








            
    

</div>

</div>

<br>

   
<div id="distancia" align="center">

	<h3 style=" background-color:#CFF; padding:12px; width:230px; border:1px solid #009595;"><span class="glyphicon glyphicon glyphicon-inbox"></span> Archivos</h3>

	<div class="panel panel-primary" style="width:600px; text-align:left;">
        <div class="panel-heading">
            <h3 class="panel-title">
            <span class="glyphicon glyphicon glyphicon-list-alt"></span>
            Plantillas
            </h3>
        </div>
        <div class="panel-body">
            <h5>
            <span class="glyphicon glyphicon-ok"></span>
            Recibos de Sueldos según Ley  20744 
            <a href="../../archivos/SUELDOS_RECIBOS - XLS2003.xlt"><img src="../../imagenes/excelimg.png" width="42" height="42"></a>
            <a href="../../archivos/SUELDOS_RECIBOS - XLS2010.xlt"><img src="../../imagenes/excelimg.png" width="42" height="42"></a>
            </h5>
            <h5>
            <span class="glyphicon glyphicon-ok"></span>
            Recibos de Sueldos para recibos Husares 4122 preimpresos
            <a href="../../archivos/husares 4122-XLS2003.xlt"><img src="../../imagenes/excelimg.png" width="42" height="42"></a>
            <a href="../../archivos/husares 4122-XLS2010.xlt"><img src="../../imagenes/excelimg.png" width="42" height="42"></a>
            </h5>
            <h5>
            <span class="glyphicon glyphicon-ok"></span>
            Planilla Horaria Ley 11544 - Decreto Reglamentario 16115/33
            <a href="../../archivos/planilla_horaria de ley - XLS2003.xlt"><img src="../../imagenes/excelimg.png" width="42" height="42"></a>
            <a href="../../archivos/planilla_horaria de ley - XLS2010.xlt"><img src="../../imagenes/excelimg.png" width="42" height="42"></a>
            </h5>
            <h5>
            <span class="glyphicon glyphicon-ok"></span>
            Relevamiento Declaración Jurada Informativa Monotributo
            <a href="../../archivos/REGIMEN INFORMATIVO MONOTRIBUTO - RG 2888 - XLS2003.xlt"><img src="../../imagenes/excelimg.png" width="42" height="42"></a>
            <a href="../../archivos/REGIMEN INFORMATIVO MONOTRIBUTO - RG 2888 - XLS2010.xlt"><img src="../../imagenes/excelimg.png" width="42" height="42"></a>
            </h5>
        </div>
    </div>
    
    
    
    
    
    
    <div class="panel panel-primary" style="width:600px; text-align:left;">
        <div class="panel-heading">
            <h3 class="panel-title">
            <span class="glyphicon glyphicon glyphicon-cloud-download"></span>
            Utilidades
            </h3>
        </div>
        <div class="panel-body">
            <h5>
            <span class="glyphicon glyphicon-ok"></span>
            Imprimir Código de Barras en DDJJ ARBA 
            <a href="../../archivos/BarCode25.rar"><img src="../../imagenes/rarimg.png" width="42" height="42"></a>
            </h5>
        </div>
    </div>

<br>

<div style="height:1px; background-color:#323232; width:300px;" align="center"></div>
<div style="height:1px; background-color:#EDEDED; width:296px;" align="center"></div>

<br>
</div>








<div style="background-color:#8B0000; height:600px;">
        <div align="center">
        <br>
        <br>
        <div style="background-color:#4c0101; height:1px; width:900px;"></div>
        <div style="background-color:#f7d5d5; height:1px; width:900px;"></div>
        
        <table width="900" border="0" cellpadding="0" cellspacing="0">
        <tr>
        <td width="60">
        <img src="../../imagenes/icon-email.png">
        </td>
        <td width="450" valign="middle" align="left">
        <h3 style="color:#FFF;">Reciba nuestras novedades</h3>
        </td>
        <td align="center" width="350" valign="middle">
        <input type="text" name="email" class="style-4" placeholder="Ingrese su e-mail">
        </td>
        <td align="center" width="50">
        <input type="button" name="enviarnoticia" id="enviarnoticia" style="background:url(../../imagenes/Logo_Telegram.png) no-repeat; height:43px; width:43px; border:none;">
        </td>
        </tr>
        </table>
        <div style="background-color:#f7d5d5; height:1px; width:900px;"></div>
        <div style="background-color:#4c0101; height:1px; width:900px;"></div>
        <br>
        <br>
        
        
        </div>
        
        <div class="container" style="width:900px; color:#FFF;">
        <form role="form" id="formContacto">
            <div class="row" align="left">
                <h3 style="padding-left:15px;">Contacto</h3>
            </div>
            <div class="row">
                <div class="col-md-6">
                    <div class="form-group">
                        <input type="text" class="form-control" id="nombreapellido" placeholder="Nombre y Apellido">
                    </div>
                </div>
        
            </div>
            <div class="row">
                <div class="col-md-3">
                    <div class="form-group">
                        <input type="text" class="form-control" id="telefono" placeholder="Teléfono">
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="form-group">
                        <input type="email" class="form-control" id="exampleInputEmail1" placeholder="E-Mail">
                    </div>
                </div>
        
            </div>
    <div class="row">
    	<textarea id="mensaje" class="col-md-6" rows="3" style="padding:10px; width:420px; margin-left:15px;"></textarea>
    </div>
    
    <div class="row">
    	<div id="loading"></div>
        <br>
    	<input id="enviarMensaje" type="button" class="col-md-6 btn btn-danger" rows="3" style="padding:10px; width:120px; margin-left:15px;" value="Enviar">
    </div>
    
</form>


<table width="300" border="0" cellpadding="0" cellspacing="0" style="float:right; margin-top:-300px;" height="300">
    <tr>
    	<td align="left">
        	<h3>Teléfonos</h3>
            <h5>15-6184415</h5>
        </td>
    </tr>
    <tr>
    	<td align="left">
        	<h3>Seguinos en Twitter</h3>
            <h5>diegomenna@superstar</h5>
        </td>
    </tr>
    <tr>
    	<td align="left">
        	<h3>Mira las noticias nuevas</h3>
            <h5>facebookdiegomenna</h5>
        </td>
    </tr>
</table>

<div class="alert alert-warning" style="margin-top:50px; color:#000;">
    	<strong>Importante!</strong>
    	Es necesario completar todos los campos para poder enviar el mensaje, menos el Teléfono. Muchas Gracias.
    </div>
    
</div>


</div>

</div>

<script type="text/javascript">
	$( document ).ready(function() {
		
		$("#nombreapellido,#mensaje,#exampleInputEmail1").click(function(event){
			$(".alert").removeClass("alert-success");
			$(".alert").removeClass("alert-danger");
			$(".alert").addClass("alert-warning");
			$(".alert").html('<strong>Importante!</strong> Es necesario completar todos los campos para poder enviar el mensaje, menos el Teléfono. Muchas Gracias.');
		});
			
		$("#enviarMensaje").click(function(event){
			$.ajax({
				data: {nombre: $("#nombreapellido").val(),
					   mensaje: $("#mensaje").val(),
					   email: $("#exampleInputEmail1").val(),
					   telefono: $("#telefono").val(), 
					   accion: 'enviarMail'},
				url: '../../ajax/ajax.php',
				type: 'post',
			beforeSend: function () {
				$("#loading").html('<img src="../../imagenes/loading.gif" width="50" height="50" />');
			},
			success: function (response) {
				$(".alert").removeClass("alert-warning");
				$(".alert").html('');
				if (response == '') {
					$(".alert").addClass("alert-success");
					$(".alert").html('<strong>Perfecto!</strong> Su mensaje ha sido enviado exitosamente. ');
					$("#loading").html('');
					$("#nombreapellido").val('');
					$("#mensaje").val('');
					$("#exampleInputEmail1").val('');
					$("#telefono").val('');
				} else {
					$(".alert").addClass("alert-danger");
					$(".alert").html('<strong>Error!</strong> '+response);
					$("#loading").html('');
				}
			}
			});
		}); 
		
		$('#enviarMensaje').click(function() {
			
		});
	});


</script>

</body>
</html>
